<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>上海交通大学</title>

    <!-- Global stylesheets -->
    <link href="http://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700,900" rel="stylesheet" type="text/css">
    <link href="/static/assets/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css">
    <link href="/static/assets/css/minified/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="/static/assets/css/minified/core.min.css" rel="stylesheet" type="text/css">
    <link href="/static/assets/css/minified/components.min.css" rel="stylesheet" type="text/css">
    <link href="/static/assets/css/minified/colors.min.css" rel="stylesheet" type="text/css">
    <!-- /global stylesheets -->

    <!-- Core JS files -->
    <script type="text/javascript" src="/static/assets/js/plugins/loaders/pace.min.js"></script>
    <script type="text/javascript" src="/static/assets/js/core/libraries/jquery.min.js"></script>
    <script type="text/javascript" src="/static/assets/js/core/libraries/bootstrap.min.js"></script>
    <script type="text/javascript" src="/static/assets/js/plugins/loaders/blockui.min.js"></script>
    <!-- /core JS files -->

    <!-- Theme JS files -->
    <script type="text/javascript" src="/static/assets/js/plugins/tables/datatables/datatables.min.js"></script>
    <script type="text/javascript" src="/static/assets/js/plugins/forms/selects/select2.min.js"></script>

    <script type="text/javascript" src="/static/assets/js/core/app.js"></script>
    <!-- /theme JS files -->

</head>

<body>

<!-- Main navbar -->
<div class="navbar navbar-inverse">
    <div class="navbar-header">
        <a class="navbar-brand" href="index.ftl"><img src="/static/assets/images/logo_light.png" alt=""></a>

        <ul class="nav navbar-nav pull-right visible-xs-block">
            <li><a data-toggle="collapse" data-target="#navbar-mobile"><i class="icon-tree5"></i></a></li>
            <li><a class="sidebar-mobile-main-toggle"><i class="icon-paragraph-justify3"></i></a></li>
        </ul>
    </div>

    <div class="navbar-collapse collapse" id="navbar-mobile">
        <ul class="nav navbar-nav">
            <li>
                <a class="sidebar-control sidebar-main-toggle hidden-xs">
                    <i class="icon-paragraph-justify3"></i>
                </a>
            </li>

            <li class="dropdown">
                <a href="user_list.ftl#" class="dropdown-toggle" data-toggle="dropdown">
                    <i class="icon-git-compare"></i>
                    <span class="visible-xs-inline-block position-right">Git updates</span>
                    <span class="badge bg-warning-400">9</span>
                </a>

                <div class="dropdown-menu dropdown-content">
                    <div class="dropdown-content-heading">
                        Git updates
                        <ul class="icons-list">
                            <li><a href="user_list.ftl#"><i class="icon-sync"></i></a></li>
                        </ul>
                    </div>

                    <ul class="media-list dropdown-content-body width-350">
                        <li class="media">
                            <div class="media-left">
                                <a href="user_list.ftl#"
                                   class="btn border-primary text-primary btn-flat btn-rounded btn-icon btn-sm"><i
                                        class="icon-git-pull-request"></i></a>
                            </div>

                            <div class="media-body">
                                Drop the IE <a href="user_list.ftl#">specific hacks</a> for temporal inputs
                                <div class="media-annotation">4 minutes ago</div>
                            </div>
                        </li>
                    </ul>

                    <div class="dropdown-content-footer">
                        <a href="user_list.ftl#" data-popup="tooltip" title="All activity"><i
                                class="icon-menu display-block"></i></a>
                    </div>
                </div>
            </li>
        </ul>

        <ul class="nav navbar-nav navbar-right">
            <li class="dropdown">
                <a href="user_list.ftl#" class="dropdown-toggle" data-toggle="dropdown">
                    <i class="icon-people"></i>
                    <span class="visible-xs-inline-block position-right">Users</span>
                </a>

                <div class="dropdown-menu dropdown-content">
                    <div class="dropdown-content-heading">
                        Users online
                        <ul class="icons-list">
                            <li><a href="user_list.ftl#"><i class="icon-gear"></i></a></li>
                        </ul>
                    </div>

                    <ul class="media-list dropdown-content-body width-300">
                        <li class="media">
                            <div class="media-left"><img src="#" class="img-circle img-sm" alt=""></div>
                            <div class="media-body">
                                <a href="user_list.ftl#" class="media-heading text-semibold">Jordana Ansley</a>
                                <span class="display-block text-muted text-size-small">Lead web developer</span>
                            </div>
                            <div class="media-right media-middle"><span class="status-mark border-success"></span></div>
                        </li>

                    </ul>

                    <div class="dropdown-content-footer">
                        <a href="user_list.ftl#" data-popup="tooltip" title="All users"><i
                                class="icon-menu display-block"></i></a>
                    </div>
                </div>
            </li>

            <li class="dropdown">
                <a href="user_list.ftl#" class="dropdown-toggle" data-toggle="dropdown">
                    <i class="icon-bubbles4"></i>
                    <span class="visible-xs-inline-block position-right">Messages</span>
                    <span class="badge bg-warning-400">2</span>
                </a>

                <div class="dropdown-menu dropdown-content width-350">
                    <div class="dropdown-content-heading">
                        Messages
                        <ul class="icons-list">
                            <li><a href="user_list.ftl#"><i class="icon-compose"></i></a></li>
                        </ul>
                    </div>

                    <ul class="media-list dropdown-content-body">
                        <li class="media">
                            <div class="media-left">
                                <img src="#" class="img-circle img-sm" alt="">
                                <span class="badge bg-danger-400 media-badge">5</span>
                            </div>

                            <div class="media-body">
                                <a href="user_list.ftl#" class="media-heading">
                                    <span class="text-semibold">James Alexander</span>
                                    <span class="media-annotation pull-right">04:58</span>
                                </a>

                                <span class="text-muted">who knows, maybe that would be the best thing for me...</span>
                            </div>
                        </li>
                    </ul>

                    <div class="dropdown-content-footer">
                        <a href="user_list.ftl#" data-popup="tooltip" title="All messages"><i
                                class="icon-menu display-block"></i></a>
                    </div>
                </div>
            </li>

            <li class="dropdown dropdown-user">
                <a class="dropdown-toggle" data-toggle="dropdown">
                    <img src="/static/assets/images/placeholder.jpg" alt="">
                    <span>Victoria</span>
                    <i class="caret"></i>
                </a>

                <ul class="dropdown-menu dropdown-menu-right">
                    <li><a href="user_list.ftl#"><i class="icon-user-plus"></i> My profile</a></li>
                </ul>
            </li>
        </ul>
    </div>
</div>
<!-- /main navbar -->


<!-- Page container -->
<div class="page-container">

    <!-- Page content -->
    <div class="page-content">

        <!-- Main sidebar -->
    <#include "/app/common_nav.ftl" />
        <!-- /main sidebar -->

        <!-- Main content -->
        <div class="content-wrapper">

            <!-- Page header -->
            <div class="page-header">
                <div class="page-header-content">
                    <div class="page-title">
                        <h4><i class="icon-arrow-left52 position-left"></i> <span class="text-semibold">用户列表</span></h4>
                    </div>


                </div>

                <div class="breadcrumb-line">
                    <ul class="breadcrumb">
                        <li><a href="index.ftl"><i class="icon-home2 position-left"></i>首页</a></li>
                        <li><a href="user_list.ftl">用户</a></li>
                        <li class="active">用户列表</li>
                    </ul>


                </div>
            </div>
            <!-- /page header -->


            <!-- Content area -->
            <div class="content">

                <!-- Basic datatable -->
                <div class="panel panel-flat">
                    <div class="panel-heading">
                        <h5 class="panel-title">用户列表</h5>
                        <div class="heading-elements">
                            <ul class="icons-list">
                                <li><a data-action="collapse"></a></li>
                                <li><a href="/user/userList" data-action="reload"></a></li>
                                <li><a data-action="close"></a></li>
                            </ul>
                        </div>
                    </div>
                    <form action="/user/userList" method="get">
                        <div class="dataTables_filter">
                            <label>
                                <span>登陆名称:</span><input type="text" name="loginName" value="${userQo.loginName!''}">
                            </label>

                            <label>
                                <span>First Name:</span><input type="text" name="firstName"
                                                               value="${userQo.firstName!''}">
                            </label>
                            <button type="submit" class="btn btn-primary">搜 索</button>
                            <button type="button" onclick="window.location.href='/user/userList'" class="btn btn-info">重 置</button>
                        </div>
                    </form>

                    <table class="table datatable-basic">
                        <thead>
                        <tr>
                            <th>First Name</th>
                            <th>Last Name</th>
                            <th>登陆名称</th>
                            <th>邮箱</th>
                            <th>创建日期</th>
                            <th class="text-center">动作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <#list page.records as user >
                        <tr>
                            <td>${user.firstName!''}</td>
                            <td><a href="#">${user.secondName!''}</a></td>
                            <td>${user.loginName!''}</td>
                            <td>${user.email!''}</td>
                            <td>${(user.createdAt?string("yyyy-MM-dd"))!}</td>
                            <td class="text-center">
                                <ul class="icons-list">
                                    <li class="dropdown">
                                        <button onclick="window.location.href='/user/show?id=${user.id!''}'" class="btn btn-success">编辑</button>
                                        <button onclick="del_user(${user.id!''})"  class="btn btn-warning">删除</button>
                                    </li>
                                </ul>
                            </td>
                        </tr>
                        </#list>

                        </tbody>
                    </table>


                    <div class="text-right">
                        <ul class="pagination pagination-separated">
                           <#list genchPager.navigatePageNumbers as number>
                               <#if number == genchPager.pageNumber >
                                   <li><a style="z-index: 2;color: #fff; background-color: #2196f3;border-color: #2196f3;cursor: default;" href="#">${number}</a></li>
                               <#else >
                                   <li><a href="/user/userList?current=${number}">${number}</a></li>
                               </#if>

                           </#list>
                        </ul>
                    </div>

                    <#--<div class="text-right">-->
                        <#--<ul class="pagination">-->

                            <#--<li class="active"><a href="#">1</a></li>-->
                            <#--<li><a href="#">2</a></li>-->
                            <#--<li><a href="#">3</a></li>-->
                            <#--<li class="disabled"><a href="#">4</a></li>-->
                            <#--<li><a href="#">5</a></li>-->
                            <#--<li><a href="#">›</a></li>-->
                        <#--</ul>-->
                    <#--</div>-->
                </div>

                <!-- /basic datatable -->

                <!-- Footer -->
                <div class="footer text-muted">
                    &copy; 2015. <a href="user_list.ftl#">Limitless Web App Kit</a> by <a
                        href="http://themeforest.net/user/Kopyov" target="_blank">Eugene Kopyov</a>
                </div>
                <!-- /footer -->

            </div>
            <!-- /content area -->

        </div>
        <!-- /main content -->

    </div>
    <!-- /page content -->

</div>
<!-- /page container -->
<script type="text/javascript">

    function del_user(id){
        var result = window.confirm("您确认需要删除该用户吗？");
        if(result){
            window.location.href = '/user/delete/'+id;
        }
    }

</script>
</body>
</html>
